<template>
	<block v-if="info">
	<view class="img">
		<image :src="info.img" mode=""></image>
		<view class=""></view>
	</view>
	<view class="times" v-if="type==1">
		<text>{{info.title}}</text>
		<text >{{info.createTime}}</text>
	</view>
	<view class="times" v-if="type==2">
		<text>{{info.firstName}}{{info.lastName}}</text>
		<text style="color: #C7A46F;">{{info.education}}</text>
	</view>
	<view class="content">
		<up-parse :content="info.content"></up-parse>
	</view>
	</block>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from 'vue';
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		articleInfo,
		celebrityInfo
	} from "@/api/index.js"
	
	let type=ref(1)
	let id=null
	let info=ref(null)
	onLoad((e) => {
		type.value=e.type
        id=e.id
		getDetail()
	})

	async function getDetail() {
		if(type.value==1){
		  let { data }=await  articleInfo({id})
		  info.value=data
		}else{
		   let { data }=await  celebrityInfo({id})	
		   info.value=data
		}
		
        
	}

</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		margin-top: 16rpx;
		background: #FFFFFF;
		box-sizing: border-box;
		padding: 30rpx;
	}

	.times {
		width: 750rpx;
		height: 154rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 0rpx 0rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		box-sizing: border-box;
		padding-left: 45rpx;

		text:nth-of-type(1) {
			font-family: PingFang-SC, PingFang-SC;
			font-weight: bold;
			font-size: 40rpx;
			color: #111111;
		}

		text:nth-of-type(2) {
			color: #999999;
			font-size: 26rpx;
			margin-top: 10rpx;
		}
	}

	.img {
		width: 750rpx;
		height: 400rpx;
		position: relative;

		image {
			width: 750rpx;
			height: 400rpx;
			background: #C1C1C1;
		}

		view {
			width: 100%;
			height: 16rpx;
			background: #FFFFFF;
			position: absolute;
			bottom: 0;
			left: 0;
			border-radius: 16rpx 16rpx 0rpx 0rpx;
			background: #FFFFFF;
		}
	}
</style>